<template>
    <div class="new-shppAdd">
        <div class="consignee">
        	<p>收货人：张超凡</p>
        </div>
        <div class="consignee">
        	<p>手机号码：18888888888</p>
        </div>
        <div class="consignee">
        	<p class="mui-navigate-right">收货地址：湖南省长沙市岳麓区 </p>
        	<button id='showCityPicker3' class="mui-btn mui-btn-block" type='button'>三级联动示例 ...</button>
				<div id='cityResult3' class="ui-alert"></div>
        </div>
        <div class="consignee">
        	<p>详细地址：麓谷企业广场</p>
        </div>
        <div class="consignee">
        	<p>设为默认地址<i id="ico"></i></p>
        </div>
        <div class="conservation">
        	保存
        </div> 	
    </div>
</template>

<script>
//	import jq from "../js/jquery-1.11.1.min.js"
//	import jq1 from "../js/jquery-weui.min.js"
//	import jq2 from "../js/city-picker.min.js"
//	import "../../static/css/jquery-weui.min.css"
//	import Mui from "../../static/mui/js/mui.min.js"
	import mui from "../../static/mui/js/mui.picker.min.js"
	

    export default {
          data(){
              return{
				
              }
          },
          mounted(){
//        	function($, doc) {
//				 $.init();
//				$.ready(function() {
//					/**
//					 * 获取对象属性的值
//					 * 主要用于过滤三级联动中，可能出现的最低级的数据不存在的情况，实际开发中需要注意这一点；
//					 * @param {Object} obj 对象
//					 * @param {String} param 属性名
//					 */
//					var _getParam = function(obj, param) {
//						return obj[param] || '';
//					};
//		
//					//					//级联示例
//					var cityPicker3 = new $.PopPicker({
//						layer: 3
//					});
//					cityPicker3.setData(cityData3);
//					var showCityPickerButton = doc.getElementById('showCityPicker3');
//					var cityResult3 = doc.getElementById('cityResult3');
//					showCityPickerButton.addEventListener('tap', function(event) {
//						cityPicker3.show(function(items) {
//							cityResult3.innerText = "你选择的城市是:" + _getParam(items[0], 'text') + " " + _getParam(items[1], 'text') + " " + _getParam(items[2], 'text');
//							//返回 false 可以阻止选择框的关闭
//							//return false;
//						});
//					}, false);
//				});
//			})(mui, document);
         },
          methods:{
          	
          }
    }
</script>

<style>
	.new-shppAdd{
		margin-top: 10px;
	}
	.consignee{
		height:70px;
		padding-left: 24px;
		line-height: 70px;
		border-bottom: 1px solid #ccc;
	}
	.consignee p {
		color:#4c4c4c;
		font-size: 16px;
	}
	.conservation{
		width:90%;
		margin-top: 60px;
		background-color: red;
		height: 60px;
		color:white;
		font-size: 22px;
		line-height: 60px;
		text-align: center;
		margin-left: 5%;
		border-radius: 10px 10px;
	}
	#ico{
		display: inline-block;
		float: right;
		width: 25px;
		height: 25px;
		background-color: red;
		margin-top: 20px;
		margin-right: 24px;
		border-radius: 4px 4px;
	}
	.mui-navigate-right:after{
		font-size: 24px;
    font-weight: 600;

    right: 9px;

    content: '';

    color: #999;
    top:222px;
	}
	.mui-navigate-right:after{
		content: '\e583';	
	}
	#city-picker{
            margin-left: 40%;
            margin-right: 20%;
            margin-top: 20%;
            width: 200px;
            height: 40px;
        }
</style>